import 'package:cached_network_image/cached_network_image.dart';
import 'package:dio/dio.dart';
import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:test01/config/config.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:test01/model/choice_travel_model.dart';

class AllItemContent extends StatefulWidget {
  var arguments;

  AllItemContent({Key? key, this.arguments}) : super(key: key);

  @override
  _AllItemContentState createState() => _AllItemContentState();
}

class _AllItemContentState extends State<AllItemContent> {
  int categoryId = 0;
  String keywords = "";
  List<ChoiceTravelModelItem> _item = [];

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    if (widget.arguments["categoryId"] != null) {
      categoryId = widget.arguments["categoryId"];
      getChoiceItem();
    }
    else {
      keywords = widget.arguments["keywords"];
      getSearchItem();
    }



  }

  getChoiceItem() async {
    var api = "${Config.domain}category/getChoiceItem?category_id=$categoryId";
    var result = await Dio().get(api);
    var allChoiceItem = ChoiceTravelModel.fromJson(result.data);
    if (mounted) {
      setState(() {
        _item = allChoiceItem.data!;
      });
    }
  }

  getSearchItem() async {
    var api = "${Config.domain}category/getSearchItem?keywords=$keywords";
    var result = await Dio().get(api);
    var allChoiceItem = ChoiceTravelModel.fromJson(result.data);
    if (mounted) {
      setState(() {
        _item = allChoiceItem.data!;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return buildMainContent();
  }

  Widget buildMainContent() {
    if (_item.isNotEmpty) {
      return StaggeredGridView.countBuilder(
        padding: const EdgeInsets.all(8.0),
        crossAxisCount: 4,
        itemCount: _item.length,
        itemBuilder: (context, index) {
          return GestureDetector(
            onTap: () {
              Navigator.pushNamed(context, "/travel", arguments: {
                "outId": _item[index].id,
                "classify": 0
              });
            },
            child: Container(
              decoration: BoxDecoration(
                  color: Colors.white, borderRadius: BorderRadius.circular(10.w)),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Container(
                    padding: EdgeInsets.only(top: 20.h, left: 20.h),
                    child: Row(children: [
                      Icon(
                        Icons.drive_file_rename_outline,
                        size: 35.w,
                        color: Colors.red,
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 20.w),
                        child: Text(
                          _item[index].name!,
                          style: TextStyle(fontSize: 32.w, color: Colors.red),
                        ),
                      ),
                    ]),
                  ),
                  Container(
                    padding: EdgeInsets.only(top: 20.h, left: 20.h, bottom: 20.h),
                    child: Row(
                      children: [
                        Icon(
                          Icons.add_location,
                          size: 20.w,
                          color: Colors.black26,
                        ),
                        Text(
                          _item[index].place!,
                          maxLines: 1,
                          overflow: TextOverflow.ellipsis,
                          style: TextStyle(fontSize: 23.w, color: Colors.black26),
                        )
                      ],
                    ),
                  ),
                  Expanded(
                      child: Container(
                          padding: EdgeInsets.only(left: 20.h, right: 20.h),
                          child: Image.network(
                            _item[index].picture!,
                            width: double.infinity,
                            fit: BoxFit.cover,
                          ))),
                  Container(
                    padding: EdgeInsets.all(20.h),
                    child: Text(
                      _item[index].description!,
                      style: TextStyle(fontSize: 25.w, color: Colors.black87),
                      maxLines: 2,
                      overflow: TextOverflow.ellipsis,
                    ),
                  ),
                ],
              ),
            ),
          );
        },
        //  staggeredTileBuilder: (index) => new StaggeredTile.fit(2),
        staggeredTileBuilder: (int index) =>
            StaggeredTile.count(2, index == 0 ? 2.5 : 3),
        //
        mainAxisSpacing: 8.0,
        crossAxisSpacing: 8.0,
      );
    } else {
      return const Text("");
    }
  }
}
